// Copyright 2012-present OSBI Ltd
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//     http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

$table-border-color: #d5d5d5;
$table-bg-color: #f9f9f9;
$table-bg-hover-color: #c2d5e2;

.sku-table-wrapper {
  width: auto;
  margin-bottom: 0;
  table-layout: fixed;
  border-spacing: 0;
  border-collapse: separate;
  border-right: 1px solid $table-border-color;
  border-bottom: 1px solid $table-border-color;

  th {
    margin-bottom: 0;
    padding: 3px 9px 3px 4px;
    font-weight: 500;
    border-left: 1px solid $table-border-color;
    white-space: normal;

    &.all_null {
      border: none;
      text-align: center;
    }

    &.col {
      border-top: 1px solid $table-border-color;
      background: $table-bg-color;
      text-align: left;
    }

    &.col_total_corner {
      border-top: 1px solid $table-border-color;
      border-bottom: 1px none $table-border-color;
      border-left: 1px none $table-border-color;
      background: $table-bg-color;
      text-align: left;
    }

    &.col_total_first {
      border-top: 1px solid $table-border-color;
      border-left: 1px solid $table-border-color;
      background: $table-bg-color;
      text-align: left;
    }

    &.col_null {
      background: $table-bg-color;
    }

    // TODO: Update the class name 'row'
    &.row {
      display: table-cell !important;
      border-top: 1px solid $table-border-color;
      background: $table-bg-color;
      text-align: left;
      white-space: nowrap;
    }

    &.row_total {
      border-top: 1px solid $table-border-color;
      border-left: 1px none $table-border-color;
      background: $table-bg-color;
      text-align: left;
    }

    &.row_total_first {
      border-top: 1px solid $table-border-color;
      border-left: 1px solid $table-border-color;
      background: $table-bg-color;
      text-align: left;
    }

    &.row_total_corner {
      border: 1px solid $table-border-color;
      background: $table-bg-color;
      text-align: left;
    }

    &.row_header {
      border-top: 1px solid $table-border-color;
      background: #ececec;
    }

    &.row_null {
      background: $table-bg-color;
    }
  }

  td {
    padding: 3px 9px 3px 4px;
    font-size: 10px;

    &.data {
      border-top: 1px solid $table-border-color;
      border-left: 1px solid $table-border-color;
      text-align: right;
      white-space: nowrap;
    }

    &.total {
      font-weight: bold;
      background: #fbfbfb;
    }
  }

  tbody tr {
    background: #fff;

    &:hover {
      background: #edf4fa !important;
    }
  }

  td.cellhighlight {
    cursor: pointer;

    &:hover {
      background: $table-bg-hover-color !important;
    }
  }

  .headerhighlight th {
    &.row:hover,
    &.col:hover {
      background: $table-bg-hover-color !important;
    }

    &.row,
    &.col {
      cursor: pointer;
    }
  }

  table td {
    &.selected,
    &.ui-selected,
    &.ui-selecting {
      background: $table-bg-hover-color !important;
    }
  }
}
